<?php
require_once "weixin_info.php";
require_once "config.php";
// require_once "jssdk.php";
// $jssdk = new JSSDK("wx16320d7479a5774c", "e111c965e8d4ba6a2ff1a99724f6d573");
// $signPackage = $jssdk->GetSignPackage();
$shop_id = !empty($_GET['shop_id']) ? $_GET['shop_id'] : '';
if(!empty($shop_id)){
	$sql="select * from dyspw_member where id = {$shop_id}";
	$loca_shop = mysqli_query($mysql, $sql);
	$shop_info = $loca_shop->fetch_all(MYSQLI_ASSOC);
}
// //视频类型
$fenlei = $mysql->query("select * from dyspw_weblinktype where parentid = 0 and checkinfo = true");
$fenlei_rows = $fenlei->fetch_all(MYSQLI_ASSOC);


?>
<!doctype html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
	<title>我拍吧</title>
	<link rel="stylesheet" href="css/core.css">
	<script src="js/jquery-2.2.4.min.js" type="text/javascript"></script>
	<script src="js/jquery.cookie.js" type="text/javascript"></script>
	<script src="js/layer/layer.js" type="text/javascript"></script>
  <style>
		 /* 除步骤1外的UI默认都不可见 */
		.page-step-2 { display:none; }
	</style>
<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?cb5d49b07e0a753dc8ee27ba2c73495d";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>
</head>
<body>
<section>
	<div class="video-info-box page-step-2">
		<div class="play"><img src="images/play.png" /><br />00:30</div>
		<video id="video_info" controls></video>
		<div class="" id="output"></div>
	</div>
	<div class="video-input-box">
		<?php if(!empty($shop_id)){?>
			<div class="main" style="width:90%;">
				<div class="recharge-desc-box" style="border: 2px solid #fd7079;margin-bottom: 20px;padding: 10px;border-radius: 10px;margin-top: 20px;letter-spacing: 1px;">
					<p style="margin-bottom: 10px;">拍 <?php echo $shop_info[0]['username'] ?>店铺视频：		</p>
					<p style="text-indent: 10px;">分享至微信好友，微信群，或平台</p>
					<p style="text-indent: 10px;">用户购买后将返10%现金到您的账户</p>
				</div>
			</div>
		<?php } ?>
		<div class="main">
			<div class="page-step-1">
				<span class="bendi" style="display: inline-block;width: 48%;text-align: center;padding: 20px 0px;">
					<img src="./images/bendi.png" alt="" onclick="btn_select_click('file')">
					<p>本地视频</p>
				</span>
				<span class="bendi" style="display: inline-block;width: 48%;text-align: center;padding: 20px 0px;">
					<img src="./images/paise.png" alt="" onclick="btn_select_click('camera')">
					<p>立即拍摄</p>
				</span>
			</div>
			<div class="input-box"><input type="text" placeholder="请输入文字介绍" id="input"></div>

			<!-- <div class="input-box " id="jiequ" style="width:48%;float:right;"><button>自动截取封面</button><div class="" id="output"></div></div> -->
			<?php if(empty($shop_id)){?>
			<div class="cl">

				<div class="input-box" style="width:24%;margin-right:1.5%;" id="tip ">
					 <button id="allmap" >添加定位</button>
					 <input type="hidden" name="lng" value="">
					 <input type="hidden" name="lat" value="">
				 </div>
				<div class="input-box" style="width:24%;">
					<!-- <button>添加商户</button> -->
					<select class="shop_sel"  name="shop" style="width: 100%;line-height: 45px;display: inline;height: 38px;border: 0px;padding-left: 2px;background: #fff;">
						<option value="">选择商户</option>
					</select>
				</div>
				<!-- <div class="input-box" style="width:24%; float:right; "><button>工具箱</button></div> -->
				<div class="input-box" style="width:24%; float:left; left:5px;">
					<select class="fl_sel" name="fl_sel" style="width: 100%;line-height: 45px;display: inline;height: 38px;border: 0px;padding-left: 2px;background: #fff; ">
						<option value="">选择分类</option>
						<?php foreach ($fenlei_rows as $key => $val) {?>
							<option value="<?php echo $val['id']; ?>" ><?php echo $val['classname']; ?></option>
						<?php }  ?>
					</select>
				</div>
				<div class="input-box" style="display:none;">
					<select class="goods_sel" name="goods_is" style="width: 100%;line-height: 45px;display: inline;height: 38px;border: 0px;padding-left: 2px;background: #fff; ">
						<option value="">选择商品</option>
					</select>
				</div>
				<!-- <div class="input-box facebtn" style="width:48%;" > -->
				<!-- <div class="input-desc face" style="    display: inline-block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;">上传封面图片(非必须)</div> -->
				<input type="hidden" name="back_img" value="">
			</div>
			<?php } ?>
			<form action="update.php" target="exec_target" method="POST" enctype="multipart/form-data" style="display:none;">
				<input type="hidden" name="FilePath" value="Goods/Thumb" />
				<input class="img_file" name="face" type="file" multiple=true value="" >
				<input type="submit" id="PicSubmit"/>
			</form>

			<iframe id="exec_target" name="exec_target" style="display:none"></iframe>

			<script type="text/javascript">
				$(".face").click(function(){
					$(".img_file").click();
				})
				// $(".yyzz_img").click(function(){
				// 	$(".img_file").click();
				// })
				$(".img_file").change(function(){
					$('#PicSubmit').click();
					$("#exec_target").load(function(){
						var data = $(window.frames['exec_target'].document.body).html();
						if(data != null){
							// $(".facebtn").find("img").attr("src",data );
							// $(".facebtn").find("img").show();
							$(".facebtn").find(".face").html(data);
							$(".facebtn").find("input").attr("value",data );
						}
					});
				})

			</script>
			</div>

			<div class="cl">
				<form id="video_select_from" style="display:none">
				  <input id="video_select_from_select_file" type="file" accept="video/mp4,video/mov" onchange="on_video_select('file')">
					<input id="video_select_from_select_camera" type="file" accept="video/*" capture="camera" onchange="on_video_select('camera')">
				</form>
				<button class="btn-submit page-step-2" onclick="btn_submit_click()" >立即发布</button>
			</div>
		</div>
	</div>

	<div class="zhezhao" style="width: 100%;height: 100%;position: fixed;top: 0;left: 0;background: rgba(0,0,0,0.6);z-index: 99; display:none;">
		<img src="images/baishe.gif" alt="" style="    width: 100px;position: relative;top: 40%;left: 40%;">
	</div>
</section>
<script type="text/javascript" src="//webapi.amap.com/maps?v=1.4.1&key=d021bae86db1d54dddc4071a5123749c"></script>
<script type="text/javascript">
// ----------------------------------------------------------------------------
let file = null; // 选中的文件对象

// ----------------------------------------------------------------------------
// 选择文件
function btn_select_click(opt) {
	// PC端默认为选择本地文件， 移动端会默认调系统功能提供像册还是摄像头选择
	$(`#video_select_from_select_${opt}`).get(0).click();
}

// ----------------------------------------------------------------------------
// 视频选择
function on_video_select(opt) {
	 file = $(`#video_select_from_select_${opt}`).get(0).files[0]
  const ext = file.name.split('.').pop().toLowerCase()
	if (['mp4', 'mov'].indexOf(ext) < 0) {
		alert(`![${file.name}], 只支持 mp4, mov 文件`)
		return;
	}
	if (file.size > (1024 * 1024 * 200)) {
		let size = (file.size / 1024 / 1024).toFixed(2)
		alert(`size:[${size}M],视频文件最多支持200M以内`)
		return;
	}
	file.oss = {
		ext,
		local: window.URL.createObjectURL(file) // 将选择的视频文件转成可访问的本地url,作预览用
	}

	$('#video_info').attr('src', file.oss.local)

	$('#video_select_from').get(0).reset();

	$('.page-step-1').hide();
	$('.page-step-2').show();
}

// ----------------------------------------------------------------------------
// 提交
function btn_submit_click() {
	if (before_submit_check() === false) { return; }


  console.log('正在上传文件, 请等待'); // 此处可加一个loading 特效增加用户体验
	$(".zhezhao").show();
  // 上传文件
	// #上传逻辑直接拷贝自index.php  本人未经过测试
	var formFile = new FormData();
	formFile.append("file", file);
	$.ajax({
			url:'fileup.php',
			data:formFile,
			dataType:'json',
			type:'post',
			processData: false,
			contentType: false,
			success:function (data) {
				console.log(data);
				// return;
				if (data.code==1) {

					do_submit(data.msg); // 文件上传成功， 正式提交表单

				} else {
					alert(data.msg)
				}
			},
			error: function() {
				alert('上传错误');
			}
	})
}

// 提交前表单验证
function before_submit_check() {
	if($("input[type=text]").val() == '') {
		layer.open({content:"请输入文字介绍",skin:'msg',time:3});
		return false;
	}
	// if($("input[type=file]").val() == '') {
	// 	layer.open({content:"请上传背景图片",skin:'msg',time:3});
	// 	return false;
	// }

	<?php if(empty($shop_id)){ ?>
		if($(".fl_sel").val() == '') {
			layer.open({content:"请选择上传分类",skin:'msg',time:3});
			return false;
		}
	<?php } ?>
	return true
}

// 正式提交表单
// #提交逻辑直接拷贝自原上传按钮事件  本人未经过测试
function do_submit(v_url) {
	var formdata = new FormData()
	// var v_url = "<?php //echo $w_url?>";
	var u_id = "<?php echo $_SESSION['Member_info'][0]['id']?>";
	var u_img = "<?php echo $_SESSION['Member_info'][0]['avatar']?>";
	var u_name = "<?php echo $_SESSION['Member_info'][0]['username']?>";
	var openid = "<?php echo $_SESSION['Member_info'][0]['openid']?>";
	var is_vip = "<?php echo $_SESSION['Member_info'][0]['is_vip']?>";

	var input  = $('#input').val();

	<?php if(empty($shop_id)){ ?>
		var back_img = $("input[name='back_img']").val();
		var lat = $("input[name='lat']").val();
		var lng = $("input[name='lng']").val();
		var goods_sel = $(".goods_sel").val();
		var fl_sel = $(".fl_sel").val();
		var shop_sel = $(".shop_sel").val();
	<?php }else{ ?>
		var back_img = '';
		var lat = '';
		var lng = '';
		var goods_sel = '';
		var fl_sel = '';
		var shop_sel = "<?php echo $shop_id; ?>";
	<?php } ?>


	formdata.append('picurl',back_img);
	formdata.append('linkurl', v_url);
	formdata.append('u_id', u_id);
	formdata.append('avatar', u_img);
	formdata.append('webname', u_name);
	formdata.append('webnote', input);
	formdata.append('lat', lat);
	formdata.append('lng', lng);
	formdata.append('classid', fl_sel);
	formdata.append('shop_id', shop_sel);
	formdata.append('goods_id', goods_sel);
	formdata.append('is_vip', is_vip);
		// console.log(u_name)
	$.ajax({
			url:'weblinkInfoUp.php',
			data:formdata,
			dataType:'JSON',
			type:'post',
			processData: false,
			contentType: false,
			success:function (data) {
				if(data.code=='y'){
					layer.open({content:data.info,skin:'msg',time:3});
					location.href="index.php";
				}else{
					layer.open({content:data.info,skin:'msg',time:3});
				}

			}
	})
}

// ----------------------------------------------------------------------------

$(function(){

	$("#jiequ").click(function(){
		var video = document.getElementById("video_info");
		jiequ(video);
	});
	function jiequ(video){
		var canvas = document.createElement("canvas");
		canvas.width = video.videoWidth * 0.3;
		canvas.height = video.videoHeight * 0.3;
		canvas.getContext('2d').drawImage(video, 0, 0, canvas.width, canvas.height);
		var img = document.createElement("img");
		img.src = canvas.toDataURL("image/png");
		$("#output").append(img);
	}

	$("#allmap").click(function(){


		var map, geolocation;
		map = new AMap.Map('allmap');
		map.plugin('AMap.Geolocation', function() {
			geolocation = new AMap.Geolocation({
				enableHighAccuracy: true //是否使用高精度定位，默认:true
			});
			geolocation.getCurrentPosition();
			AMap.event.addListener(geolocation, 'complete', function(point){
				var lnglatXY = [point.position.lng, point.position.lat]; //已知点坐标
				map.plugin('AMap.Geocoder', function() {
					var geocoder = new AMap.Geocoder();
					geocoder.getAddress(lnglatXY, function(status, result) {
						if (status === 'complete' && result.info === 'OK') {
							var address = result.regeocode.formattedAddress;
							var obj = result.regeocode.addressComponent;
							address = address.replace(obj.province, '');
							address = address.replace(obj.district, '');
							address = address.replace(obj.city, '');
							// alert(address);
							var lng = point.position.lng;
							var lat = point.position.lat;
							console.log(address);
							$("input[name='lng']").attr('value', point.position.lng);
							$("input[name='lat']").attr('value', point.position.lat);
							console.log(point.position.lng,point.position.lat);
							$.ajax({
					            url:'baishe_ajax.php',
					            data:{'lng':lng, 'lat':lat},
					            dataType:'JSON',
					            type:'post',
					            // processData: false,
								success:function (ret) {
									console.log(ret.data);
									if(ret.status == 'y'){
										var option = '';
									  $.each(ret.data, function(){
											option += "<option value="+this.id+">"+this.title+"</option>";
										});
										$(".shop_sel").empty()
										$(".shop_sel").append(option);
									}else if (data.status == 'n') {
										layer.open({content:data.info,skin:'msg',time:3});
									}
								}
							})
						}
					});
				});
			});
		});
	})

	//商品选择改变时出发获取商品
	$(".shop_sel").bind("change", function(){
		var id = $(this).val();
			$(".goods_sel").empty()
			$.ajax({
				url:'Get_GoodsList.php',
				data:{'id':id},
				dataType:'JSON',
				type:'post',
				success:function (ret) {
					console.log(ret);
					if(ret.status == 'y'){
						var option = '';
					  $.each(ret.data, function(){
							console.log(this.id, this.title);
							option += "<option value="+this.id+">"+this.title+"</option>";
						});
						$(".goods_sel").parent().show();
						$(".goods_sel").append(option);
					}else if (data.status == 'n') {
						layer.open({content:data.info,skin:'msg',time:3});
					}
				}
			})
	})


//上传时做角色限定  游客上传时定位于选择商品不可见



    $(".play").click(function(){
		// $(".video-img").hide();
		$('video').trigger('play');
		// var video = document.querySelector('#video_info');
		// video.display = 'block';
    	// video.play();
		$(this).hide();
	});
});

</script>
</body>
</html>
